<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="/static/js/case.js"></script>
    <script src="/static/js/interjs.js"></script>
    <script src="/static/js/allcode.js"></script>
    <title>接口列表</title>
</head>
<body>
<div class="col-sm-3 col-md-2 sidebar">
    <div>
        <ul class="nav nav-pills nav-stacked">
            <c:forEach items="${interinfoWebs}" var="iterinfo">
                <c:set value="" var="interinfochecktype"/>
                <c:if test="${getinterinfoid == iterinfo.interid}">
                    <c:set value="active" var="interinfochecktype"/>
                </c:if>
                <li class="${interinfochecktype}">
                    <a href="/case/caseinfo?caseid=${caseinfo.caseid}&interinfoid=${iterinfo.interid}" style="display: inline-block">
                            ${iterinfo.interfacename}
                    </a>
                    <button name="ooo" style="display: inline-block" onclick="delinterinfomodel(${iterinfo.interid})">
                        <span class="glyphicon glyphicon-minus-sign"></span>
                    </button>
                </li>
            </c:forEach>
        </ul>
    </div>
    <div>
        <button type="button" class="btn btn-info" onclick="goaddinterinfohtml(${caseinfo.caseid})">添加接口</button>
        <button type="button" class="btn btn-info" onclick="gocaselisthtml(${caseinfo.projectid})">返回case列表</button>
    </div>
</div>
<div class="col-sm-3 col-md-8 sidebar">
    <div name="caseinfo">
        <h4 style="display: none">接口ID:<small id="interinfoid">-1</small></h4>
        <h4>用例ID:<small id="smallcaseinfoid">${caseinfo.caseid}</small></h4>
        <h4>用例名称：<small>${caseinfo.casename}</small></h4>
        <h4>用例描述：<small>${caseinfo.caseinfo}</small></h4>
    </div>
    <div class="progress">
        <div class="progress-bar" role="progressbar"
             aria-valuenow="100" aria-valuemin="0"
             aria-valuemax="100" style="width: 100%;">
        </div>
    </div>
    <div name="httpinfo">
        <div class="form-group">
            <label for="interfacename">接口名称:</label>
            <div style="display: inline-block">
                <input value="${interinfoWeb.interfacename}" type="text" class="form-control" id="interfacename" placeholder="请输入接口名称">
            </div>
            <div style="display: inline-block">
                <button type="button" class="btn btn-info" onclick="debuginterinfoweb()">在线测试</button>
            </div>
            <div style="display: inline-block">
                <button type="button" class="btn btn-info" onclick="addinterinfoparam()">保存接口</button>
            </div>
        </div>

        <div>
            <h5>请求信息:</h5>
            <div style="display: inline-block">
                <select class="form-control" id="httptypeselect">
                    <c:forEach items="${httptypemap}" var="httptype">
                        <option value="${httptype.key}">${httptype.value}</option>
                    </c:forEach>
                </select>
            </div>
            <div style="display: inline-block">
                <select class="form-control" id="httpmethselect">
                    <c:forEach items="${httpmethmap}" var="httpmeth">
                         <option value="${httpmeth.key}">${httpmeth.value}</option>
                    </c:forEach>
                </select>
            </div>
            <div class="form-group" style="display: inline-block">
                <label for="httpurlinput">路径:</label>
                <div style="display: inline-block;width: 600px">
                    <input value="${interinfoWeb.httpurl}" type="text" class="form-control" id="httpurlinput" placeholder="请输入要访问的url">
                </div>
            </div>
        </div>
        <div name="headerinfoname" id="headerinfolists">
            <h5>Header信息:</h5>
                <div>
                    <div class="form-group" style="display: inline-block">
                        <label>key:</label>
                        <div style="display: inline-block;width: 200px">
                            <input value="tenantId" name="headkey" type="text" class="form-control">
                        </div>
                    </div>
                    <div class="form-group" style="display: inline-block;width: 60%">
                        <label>value:</label>
                        <div style="display: inline-block;width: 500px">
                            <input value="123" name="headvalue" type="text" class="form-control">
                        </div>
                    </div>
                    <div style="display: inline-block">
                        <button name="addheaderinfo"><span class="glyphicon glyphicon-plus-sign"></span></button>
                    </div>
                </div>

            <div>
                <div class="form-group" style="display: inline-block">
                    <label>key:</label>
                    <div style="display: inline-block;width: 200px">
                        <input value="applicationId" name="headkey" type="text" class="form-control">
                    </div>
                </div>
                <div class="form-group" style="display: inline-block;width: 60%">
                    <label>value:</label>
                    <div style="display: inline-block;width: 500px">
                        <input value="123" name="headvalue" type="text" class="form-control">
                    </div>
                </div>
                <div style="display: inline-block">
                    <button name="addheaderinfo"><span class="glyphicon glyphicon-plus-sign"></span></button>
                    <button name="removeheaderinfo"><span class="glyphicon glyphicon-minus-sign"></span></button>
                </div>
            </div>

            <div>
                <div class="form-group" style="display: inline-block">
                    <label>key:</label>
                    <div style="display: inline-block;width: 200px">
                        <input value="userId" name="headkey" type="text" class="form-control">
                    </div>
                </div>
                <div class="form-group" style="display: inline-block;width: 60%">
                    <label>value:</label>
                    <div style="display: inline-block;width: 500px">
                        <input value="123" name="headvalue" type="text" class="form-control">
                    </div>
                </div>
                <div style="display: inline-block">
                    <button name="addheaderinfo"><span class="glyphicon glyphicon-plus-sign"></span></button>
                    <button name="removeheaderinfo"><span class="glyphicon glyphicon-minus-sign"></span></button>
                </div>
            </div>
        </div>

        <div name="httpparamtype">
            <h5>请求内容(正常只有POST才有):</h5>
            <div>
                <label class="radio-inline">
                    <input type="radio" name="httptypes" id="jsonhttptype" value="1" checked>JSON
                </label>
                <label class="radio-inline">
                    <input type="radio" name="httptypes" id="fromhttptype"  value="2">x-www-from
                </label>
            </div>
            <div>
                <h5>都是输入json格式:</h5>
                <form role="form">
                    <div class="form-group">
                        <textarea id="httpinfoparams" class="form-control" rows="3"></textarea>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="progress">
        <div class="progress-bar" role="progressbar"
             aria-valuenow="100" aria-valuemin="0"
             aria-valuemax="100" style="width: 100%;">
        </div>
    </div>
    <div name="checkhttpinfo">
        <div>
            <label class="radio-inline">
                <input type="radio" name="httpchecktypes" id="checkarrerttype"  value="1" checked>规则校验
            </label>
            <label class="radio-inline">
                <input disabled="disabled" type="radio" name="httpchecktypes" id="checkscripttype"  value="2">脚本校验(暂不支持)
            </label>
        </div>
        <div>
            <table id="autocheckinfotables" class="table">
                <thead>
                    <tr>
                        <th>内容</th>
                        <th style="width: 20%;">校验方式</th>
                        <th>预期结果</th>
                        <th style="width: 10%">操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>
                            <input name="checkinfoname" type="text" class="form-control">
                        </td>
                        <td>
                            <select name="autoExpectEnumname" class="form-control">
                                <c:forEach items="${autoexpectmap}" var="autoexpect">
                                    <option value="${autoexpect.key}">${autoexpect.value}</option>
                                </c:forEach>
                            </select>
                        </td>
                        <td>
                            <input name="expectinfoname" type="text" class="form-control">
                        </td>
                        <td>
                            <button name="addchecktableinfo"><span class="glyphicon glyphicon-plus-sign"></span></button>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>


<div name="checktyplist" style="display: none">
    <div id="checktypehtmlmode">
        <select class="form-control" name="autoExpectEnumname">
            <c:forEach items="${autoexpectmap}" var="autoexpect">
                <option value="${autoexpect.key}">${autoexpect.value}</option>
            </c:forEach>
        </select>
    </div>
</div>

<div>
    <div class="modal fade" id="messagemodel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                    <h5 id="httpmessageid"></h5>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
</div>

<div class="modal fade" id="delinterinfoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <h5 id="delinteridmodel" style="display: none"></h5>
            <div class="modal-body">
                是否确定删除
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                </button>
                <button type="button" class="btn btn-primary" onclick="delinterinfohttp()">
                    确定
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<div id="debugpageid">
    <div class="modal fade" id="debugmodel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="width: 900px">
            <div class="modal-content">
                <div style="height: 1500px" class="modal-body" id="debugmodelbody">
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
</div>

<script type="text/javascript">
    addheaderstepinfo();
    removeheaderinfo();
    addcheckhtmlinfo();
    removecheckinfo();
</script>
</body>
</html>
